import { useState } from 'react'
import { useAnimations, useGLTF } from '@react-three/drei'
import AnimationSelector from './controls/ActionSelector';
import useAnimationControl from './hooks/useAnimationControl'

const DigitalHuman = () => {
    const { scene: model, animations } = useGLTF('/models/整体.glb');
    const { actions, mixer } = useAnimations(animations, model)
    const { selectedAction, handleActionChange } = useAnimationControl(actions)

    return (
        <>
            <AnimationSelector
                animations={animations}
                selectedAction={selectedAction}
                onChange={handleActionChange}
            />
            <primitive
                object={model}
                position={[0, -1, 0]}
                scale={[0.8, 0.8, 0.8]}
            />
        </>
    )
}

export default DigitalHuman
